<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>无标题文档</title>
    <style type="text/css">
        * {
            margin: 0px;
            padding: 0px;
        }

        .g {
            float: left;
            width: 676px;
        }

        .g a {
            margin: 0 5px;
        }

        .g .g5 a {
            background: #000;
            display: block;
            width: 90px;
            height: 213px;
            float: left;
        }

        .g .g5 a:hover, .g .current a {
            background: red;
            width: 366px;
            height: 213px;
            display: block;
        }

        .g .g6 a {
            background: #000;
            display: block;
            width: 90px;
            height: 213px;
            float: left;
        }

        .g .g6 a:hover {
            background: red;
            width: 366px;
            height: 213px;
            display: block;
        }

        .g .g7 a {
            background: #000;
            display: block;
            width: 90px;
            height: 213px;
            float: left;
        }

        .g .g7 a:hover {
            background: red;
            width: 366px;
            height: 213px;
            display: block;
        }
    </style>
</head>
<body>
<div class="g">
    <div class="g5 current"><a href="#">as</a></div>
    <div class="g6"><a href="#">as</a></div>
    <div class="g7"><a href="#">as</a></div>
</div>
</body>
</html>